<template>
	<div>
		<div class="breadcrumb">
			<el-button type="text" @click="$router.back()" icon="el-icon-arrow-left" style="font-size: 14px;">返回上一页</el-button>
		</div>
		<div class="tableNavBox">
			<div class="menberConTitle flex" style="justify-content: space-between;">
				<div class="tableTitle">主持在研项目</div>
			</div>
			<div>
				<el-form :model="formInline" class="demo-form-inline" label-width="100px">
					<el-form-item label="开始日期：">
						<el-date-picker v-model="formInline.startDate" class="formInput" format="yyyy-MM" value-format="yyyy-MM" type="month" placeholder="选择年月"></el-date-picker>
					</el-form-item>
					<el-form-item label="项目名称：">
						<el-input v-model="formInline.projectName" class="formInput" placeholder="请输入项目名称"></el-input>
					</el-form-item>
					<el-form-item label="课题名称：">
						<el-input v-model="formInline.subjectName" class="formInput" placeholder="请输入课题名称"></el-input>
					</el-form-item>
					<el-form-item label="链接：">
						<el-input v-model="formInline.link" class="formInput" placeholder="如:http://www.baidu.com"></el-input>
					</el-form-item>
				</el-form>
			</div>
		</div>
		<div class="bottomBtns">
			<!-- <el-button type="primary" round @click="$router.back()">返回</el-button> -->
			<el-button type="primary" round @click="submit">完成</el-button>
		</div>
	</div>
</template>

<script>
	import add from '../utils/index.js'
	export default {
		data() {
			return {
				formInline: {
					projectName: '' ,// 项目名称
					subjectName: '' ,// 课题名称
					link: '' ,// 链接
					startDate: '' ,// 开始时间
					isOpen: '1' // 是否公开
				}
			}
		},
		created() {
			this.$store.commit('industrialis_leftNavIndex', 11)
		},
		mounted() {
			
			if (this.$route.query.index > -1) {
				this.dataIndex = this.$route.query.index
				// 页面数据渲染
				add.research.getSelf(this.dataIndex, (data) => {
					this.formInline.projectName = data.projectName
					this.formInline.subjectName = data.subjectName
					this.formInline.link = data.link
					this.formInline.startDate = data.startDate
					this.formInline.isOpen = data.isOpen
				})
				this.isUpdete = true
			} else {
				this.isUpdete = false
			}

		},
		watch: {


		},
		methods: {
			submit(){
				if(!this.formInline.startDate){
					this.$message.error('请选择开始时间')
					return
				} else if(!this.formInline.projectName){
					this.$message.error('请输入项目名称')
					return
				} else if(!this.formInline.subjectName){
					this.$message.error('请输入课题名称')
					return
				} 
				if(!this.isUpdete){
					add.research.addition(this.formInline)
				} else {
					add.research.update(this.formInline, this.dataIndex)
				}
				this.$router.back()
			},
			// uploadFile(file){
			// 	// 上传文件
			// 	let File = file.file
			// 	add.uploadFile(File, (data) => {
			// 		this.formInline.image = data
			// 		this.$message.success('上传成功')
			// 	})
				
			// }
		}
	}
</script>

<style scoped="scoped">
	.breadcrumb,
	.tableNavBox {
		padding: 20px;
	}

	.tableNavBox {
		padding-top: 0;
		min-height: 595px;
	}

	.tableTitle {
		font-size: 16px;
		font-family: Microsoft YaHei;
		font-weight: 400;
		color: #333333;
		line-height: 30px;
	}

	.menberConTitle {
		width: 100%;
		background: #F3F3F3;
		text-align: left;
		padding: 5px 20px;
		margin-bottom: 20px;
		/* margin-top: 20px; */
	}

	.topButton {
		width: 78px;
	}

	.formInput {
		width: 420px;
	}

	.formDate {
		width: 150px;
	}


	.bottomBtns {
		width: 100%;
		border-top: 1px solid #DCDCDC;
		padding: 30px 0;
		text-align: center;
	}

	.bottomBtns button {
		width: 100px;
	}
</style>
